<template>
	<view class="editaddress">
		<view>
			<view class="addr_input_cell">
				<view class="addr_input_title">收货人</view>
				<view class="addr_input_box">
					<input class="addr_input" v-model="form.name" placeholder="收货人"
						placeholder-style="color: #666666;" />
				</view>
			</view>
			<view class="addr_input_cell">
				<view class="addr_input_title">手机号码</view>
				<view class="addr_input_box">
					<input class="addr_input" v-model="form.mobile" maxlength="11" placeholder="手机号码"
						placeholder-style="color: #666666;" />
				</view>
			</view>
			<view class="addr_input_cell">
				<view class="addr_input_title">所在地区</view>
				<view class="addr_input_box">
					<picker class="flex-1" @change="bindRegionChange" :value="region" mode='region'>
						<view class="" v-if="region.length>0">{{region[0]}}，{{region[1]}}，{{region[2]}}</view>
						<view class="c-666666" v-else>请选择省市区</view>
					</picker>
				</view>
			</view>
			<view class="addr_textarea_cell">
				<view class="addr_textarea_title">详细地址</view>
				<view class="addr_textarea_box">
					<textarea class="addr_textarea" v-model="form.address" placeholder="详细地址"
						:disable-default-padding="true" placeholder-style="color: #666666;"></textarea>
				</view>
			</view>
			<view class="addr_input_cell" style="margin-top: 90rpx;" @click="changeDefaultAddr">
				<view class="flex-1 f-13 f-w">设为默认收货地址</view>
				<uni-icons v-if="form.status==1" type="checkbox-filled" color="#00A0DC" size="22"></uni-icons>
				<uni-icons v-else type="circle" size="22" color="#00A0DC"></uni-icons>
			</view>
		</view>
		<view class="addr_btn_box" :style="'bottom:'+btnbottom+'px;'">
			<view class="addr_btn" @click="saveAddr()">保存</view>
		</view>
	</view>
</template>

<script>
	import {
		editShopAddr,
		addShopAddr,
	} from '@/api/motortime.js';
	let app = getApp()
	export default {
		data() {
			return {
				form: {
					status: 0
				},
				region: [],
				isSubmit: true,
				regioncode: [],
				isDefault: false,
				btnbottom: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets.bottom +
					10 : 30
			};
		},
		onShow() {

		},
		onLoad(options) {
			this.form = uni.getStorageSync('taskAddrInfo') ? uni.getStorageSync('taskAddrInfo') : {
				status: 0
			}
			uni.removeStorage({
				key: 'taskAddrInfo'
			})
		},
		methods: {
			bindRegionChange(e) {
				this.region = e.detail.value
				this.regioncode = e.detail.code
				this.form.province_id = this.regioncode[0]
				this.form.city_id = this.regioncode[1]
				this.form.area_id = this.regioncode[2]
				this.form.province_name = this.region[0]
				this.form.city_name = this.region[1]
				this.form.area_name = this.region[2]
			},
			changeDefaultAddr() {
				this.form.status = this.form.status == 0 ? 1 : 0
			},
			saveAddr() {
				if (this.isSubmit) {
					this.isSubmit = false
					if (this.form.name == '') {
						uni.showToast({
							title: '请填写收货人姓名',
							icon: 'none'
						})
						this.isSubmit = true
						return false
					} else if (this.form.mobile == '') {
						uni.showToast({
							title: '请填写收货人手机号',
							icon: 'none'
						})
						this.isSubmit = true
						return false
					} else if (!(/^1[3456789]\d{9}$/.test(this.form.mobile))) {
						uni.showToast({
							title: '请填写正确的手机号',
							icon: 'none'
						})
						this.isSubmit = true
						return false
					} else if (this.regioncode.length < 3) {
						uni.showToast({
							title: '请选择所在地区',
							icon: 'none'
						})
						this.isSubmit = true
						return false
					} else if (this.form.address == '') {
						uni.showToast({
							title: '请填写收货人详细地址',
							icon: 'none'
						})
						this.isSubmit = true
						return false
					}
					console.log(this.form)

					if (this.form.id > 0) {
						editShopAddr(this.form).then(res => {
							if (res.state == 1) {
								uni.navigateBack({
									delta: 1
								})
								var that = this
								setTimeout(function() {
									that.isSubmit = true
								}, 1000)
							} else {
								this.isSubmit = true
								uni.showToast({
									title: res.error[0],
									mask: true,
									icon: 'none',
									duration: 1500
								})
							}
						})
					} else {
						addShopAddr(this.form).then(res => {
							if (res.state == 1) {
								uni.navigateBack({
									delta: 1
								})
								var that = this
								setTimeout(function() {
									that.isSubmit = true
								}, 1000)
							} else {
								this.isSubmit = true
								uni.showToast({
									title: res.error[0],
									mask: true,
									icon: 'none',
									duration: 1500
								})
							}
						})
					}
				}
			}
		},
	}
</script>

<style lang="scss">
	.editaddress {
		.addr_input_cell {
			margin: 40rpx 35rpx;
			display: flex;
			align-items: center;

			.addr_input_title {
				width: 180rpx;
				font-size: 26rpx;
				font-weight: bold;
			}

			.addr_input_box {
				flex: 1;
				font-size: 24rpx;
				padding: 30rpx 20rpx;
				border-radius: 8rpx;
				border: 1rpx solid #E9E9E9;

				picker {
					line-height: 1.4rem;
				}
			}

		}

		.addr_textarea_cell {
			margin: 30rpx 35rpx;
			display: flex;
			align-items: flex-start;

			.addr_textarea_title {
				width: 180rpx;
				font-size: 26rpx;
				font-weight: bold;
			}

			.addr_textarea_box {
				flex: 1;
				font-size: 24rpx;
				padding: 30rpx 20rpx;
				border-radius: 8rpx;
				border: 1rpx solid #E9E9E9;

				.addr_textarea {
					width: auto;
					height: 140rpx;
				}
			}

		}

		.addr_btn_box {
			position: fixed;
			left: 30rpx;
			right: 30rpx;
			z-index: 1;

			.addr_btn {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				color: #ffffff;
				padding: 30rpx 0;
				border-radius: 8rpx;
				background-color: #00A0DC;
			}
		}
	}
</style>